/**ducument navlist css**/
/**公共部分**/
*{
    margin: 0px;
    padding:0px;
}
a{
    text-decoration: none;
}
ul li{
    list-style: none;
}

body{
    background: #F9F9F9;
}

/****头部固定位置******/
#header_fixed{
    width: 100%px;
    height: 20px;
    background: #000;
}
/****头部区域开始*****/
#header{
    width: 100%;
    height: 100px;
    background: #FFF;
    .header_content{
        width: 980px;
        height: 100px;
        margin: 0 auto;
        position: relative;
        .logo{
            width: 460px;
            height: 100px;
            position: absolute;
            left:100px;
            top:0px;
            img{
                width:460px;
                height:100px;
            }
        }
        .login{
            width:210px;
            height: 70px;
            position: absolute;
            right: 0px;
            top:0px;
            a{
                display: block;
                width:60px;
                height:70px;
                float: left;
                margin-left:10px;
                background: url(../images/icons.png) -5px -121px;
                text-align: center;
                font:400 12px/60px '微软雅黑';
                color:#000000;
                span{
                    display:block;
                    width:40px;
                    height: 40px;
                    margin: 10px auto;
                    background: url(../images/icons.png) -3px -2px;
                }
                &:hover span{
                    background: url(../images/icons.png) -126px -2px;
                }
            }
        }
        //已登录
       .logined{
           width:400px;
           height: 55px;
           position:absolute;
//         background: orange;
           top:20px;
           right:0px;
           a{
               display:block;
               float: right;
               padding-left:20px;
               font:400 16px/50px '微软雅黑';
               color:#333;
           }
           span{
               color:red;
           }
           .face{
               width:50px;
               height:50px;
               img{
                   width:100%;
                   height:100%;
                   border-radius:25px;
               }
           }
       }
    }
}

/**
     * 菜单栏
 */
#nav{
    background: #FFF;
    width:100%;
    height:54px;
    .nav_content{
        width:980px;
        height:54px;
        margin:0 auto;
        position:relative;
        a{
            display:block;
            font:700 16px/54px '微软雅黑';
            color:#000;
            float:left;
            padding:0px 5px;
            margin-right:30px;
        }
        .search{
            width:235px;
            height:30px;
            position:absolute;
            top:10px;
            right:100px;
            background:url(../images/ico.png) 0px -2144px;
            form{
               .text{
                   display:block;
                   position: absolute;
                   border: none;
                   top: 6px;
                   left: 10px;
                   width:170px;      
                }
                .sbt{
                    display:block;
                    position: absolute;
                    top:6px;
                    right:0px;
                    width:45px;
                    border:none;
                    background:url(../images/ico.png) 8px -2193px;
                } 
            }
            
        }
    }
    
}

/***********************内容区域*****************************************/
#container{
    width: 980px;
    margin: 0 auto;
    /***********产品购买区***********/
    .goods{
        width:980px;
        margin-top:30px;
        overflow: hidden;
        .g_head{
            width:980px;
            height: 50px;
            border-bottom:1px solid #E6E7E8;
            margin-bottom:30px;
            font: 400 14px/25px '微软雅黑';
            padding-bottom:15px;
            position: relative;
            a.brand{
                display: block;
                width: 50px;
                height:50px;
                position: absolute;
                left: 0px;
                top: 0px;
//              border: 1px solid red;
                img{
                    width: 100%;
                    height: 100%;
                }
            
            }
            h5{
                position: absolute;
                left: 70px;
                top: 0px;
            }
            .desc{
                position: absolute;
                left: 70px;
                top: 30px;
            }
        }
        .g_img{
            width: 600px;
            height:600px;
            float:left;
            img{
                width:100%;
                height:100%;
            }
            
        }
        .g_infor{
            width:340px;
            height:600px;
            float:right;
            /**js添加选中样式***/
            .selected{
                background: url(../images/content_icos.png) right bottom;
            }
            /**产品标题*/
            h2{
                font:400 18px/28px '微软雅黑';
            }
            /**信息中间的块**/
            dl{
                overflow: hidden;
                width:340px;
                margin:10px 0px;
                font:400 16px/22px '微软雅黑';
                dd{
                    cursor: pointer;
                }
                /**品牌**/
                .brand{
                    float:left;
                    margin-right:30px;
                }
                .b_cont{
                   float:left;
                }
                /**大小**/
                .size{
                    margin-bottom: 5px;
                }
                .s_cont{
                    border:1px solid #222222;
                    cursor: pointer;
                    padding:5px;
                    margin:5px;
                    float:left;
                }
                /**颜色**/
                .color{
                    margin-bottom:5px;
                }
                .c_cont{
                    border: 1px solid #222222;
                    padding:5px;
                    margin: 5px;
                    cursor: pointer;
                    float:left;
                }
                /**数量**/
                .numb{
                    margin-bottom:10px;
                }
                .n_reduce,.n_add{
                    float:left;
                    width:40px;
                    height:30px;
                    border:1px solid #222222;
                    font:700 20px/30px '微软雅黑';
                    color:#000000;
                    background: #FFF;
                    cursor: pointer;
                }
                .n_num{
                    display: block;
                    font:700 20px/30px '微软雅黑';
                    float:left;
                    width:60px;
                    height:28px;
                    border-top:1px solid #222222;
                    border-bottom:1px solid #222;
                    border-left:none;
                    border-right:none;
                    text-align: center;
                }
                .n_stock{
                    font:400 12px/30px '微软雅黑';
                    color:#888888;
                    display:block;
                    float:left;
                    margin-left:20px;
                    background: #FFF;
                }
                
            }
            /**信息底部快：价格块+购买块**/
            .infor_bottom{
                width:340px;
                height:164px;
                position: relative;
                .price{
                    position: absolute;
                    top:20px;
                    left:0px;
                    font:700 28px/35px '微软雅黑';
                }
                span.s1{
                    position: absolute;
                    top:60px;
                    left:0px;
                    font:400 14px/22px '微软雅黑';
                }
                span.s2{
                    display:block;
                    position: absolute;
                    top:60px;
                    left:150px;
                    font:400 18px/22px '微软雅黑';
                    .ico{
                        display:block;
                        position: absolute;
                        top:0px;
                        left:-30px;
                        width:30px;
                        height:30px;
                        background: url(../images/content_icos.png) no-repeat 0px -32px;
                    }
                }
                /**a标签的公共样式**/
                .a_public(){
                    display: bokck;
                    width:162px;
                    height:52px;
                    font:400 20px/52px '微软雅黑';
                    text-align:center;
                    border: 2px solid #000000;
                }
                .a_buy{
                    .a_public;
                    position:absolute;
                    bottom: 10px;
                    left: 0px;
                    background: #000000; 
                    color:#FFF;
                }
                .a_car{
                    .a_public;
                    position: absolute;
                    bottom: 10px;
                    left:170px;
                    background: #FFF;
                    color:#000000;
                }
            }
            /***信息底部快end**/
            
        }
    }
    /*************同类产品推荐区**************/
   .goodssame{
       margin-top:80px;
       padding:20px 20px;
       width: 940px;
       height:220px;
       background: #FFF;
       border: 1px solid #E6E7E8;
       .gs_title{
           width: 980px;
           height:30px;
           position: relative;
           h2{
               font: 400 16px/18px '微软雅黑';
           }
           span.b{
               display: block;
               width: 20px;
               border: 2px solid #000000;
               position: absolute;
               bottom: 0px;
               left: 0px;
           }
       }
       .gs_cont{
           width: 980px;
           height: 136px;
           margin-top:30px;
           a{
               display: block;
               width: 150px;
               height: 136px;
               float: left;
               background: green;
               margin-right: 10px;
               img{
                   width: 100%;
                   height: 100%;
               }
           }
       }
       
   }
   
   /******************商品描述与评论**********************/
   .goodsdesc{
       margin-top:30px;
       width:980px;
       border: 1px solid #E6E7E8;
       background: #FFF;
       .gd_title{
           width:980px;
           height:55px;
           border-bottom: 1px solid #E6E7E8;
           ul li{
               float:left;
               padding:20px 30px;
               position: relative;
               cursor: pointer;
               font:400 18px/22px solid;
               span.line{
                   display: block;
                   height:30px;
                   border-right:1px solid #E6E7E8;
                   position: absolute;
                   top:15px;
                   right:0px;
               }
               span.s{
                   border-bottom: 3px solid #fff;
                   padding-bottom: 10px;
               }
               span.s2{
                   padding:0px 15px 10px 15px;
               }
           }
       }
       .gd_cont{
           width:980px;
           background: #FFF;
           /**tab切换中的块**/
           .tab_box{
               width:750px;
               margin:50px auto;
               .gd_tag{
                   width:750px;
                   height: 100px;
                   position: relative;
                   a{
                       font:400 12px/22px solid;
                       color:#222222;
                       float: left;
                       padding:0px 10px;
                       border-radius: 8px;
                       background: #E6E7E8;
                       margin-right:20px;
                       &:hover{
                           background: #222222;
                           color: #FFF;
                       }
                   }
                   /**右侧小图片**/
                   .dd{
                       width:143px;
                       height: 47px;
                       background: url(../images/dd.png) no-repeat;
                       position: absolute;
                       top:-20px;
                       right:-60px;
                   }
               }
               .gd_img{
                   width:750px;
                   img{
                       width:100%;
                   }
               }
           }
         /**tab切换块end**/
         /***评论****/
         .tab_box2{
             display:none;
             width:750px;
             margin: 50px auto;
             .con_form{
                 width: 750px;
                 height:200px;
                 .f_conts{
                     width:730px;
                     height: 80px;
                     font: 400 14px/22px '微软雅黑';
                     padding:10px;
                     resize: none;
                     border: none;
                     background: #EEEEEE;
                 }
                 .f_sbt{
                     width: 120px;
                     height: 30px;
                     border: 1px solid #222222;
                     text-align: center;
                     background: #FFF;
                     font: 400 16px/30px '微软雅黑';
                     float:right;
                     margin-top:30px;
                     cursor: pointer;
                 }
             }
             .con_cont{
                 margin-top:50px;
                 width: 750px;
                 li{
                     width: 750px;
                     height: 150px;
                     position: relative;
                     border-bottom: 1px solid #E6E7E8;
                     margin-top:30px;
//                   padding-top: 50px;
                     a,span{
                         color: #222222;
                         font: 400 12px/22px '微软雅黑';
                     }
                     .c_face{
                         display: block;
                         position: absolute;
                         top: 0px;
                         left: 0px;
                         width: 50px;
                         height: 50px;
                         img{
                             width: 100%;
                             height: 100%;
                         }
                     }
                     .c_name{
                          position: absolute;
                          top: 0px;
                          left: 60px;
                        }
                        .conts{
                           display: block;
                           font-size: 14px;
                           width: 700px;
                           position: absolute;
                           top:30px;
                           left: 60px;
                         }
                         .c_time{
                            position: absolute;
                            top: 0px;
                            right: 0px;
                         }
                 }
             }
         }  
       }
   }
   
   /***********喜欢这商品的人****************/
   .liker{
       margin-top:30px;
       width:940px;
       height: auto;
       padding: 20px;
       border:1px solid #E6E7E8;
       background: #FFF;
       overflow: hidden;
       .l_title{
           width:940px;
           height:30px;
           position: relative;
           h2{
               font:400 16px/30px '微软雅黑';
           }
           span.b{
               display: block;
               width: 20px;
               border: 2px solid #000000;
               position: absolute;
               bottom: 0px;
               left: 0px;
           }
       }
       .l_face{
           width:940px;
           height:auto;
           margin-top:30px;
           a{
               display: block;
               width:55px;
               height:55px;
               float:left;
               margin-right:20px;
               margin-bottom: 20px;
               img{
                   width:100%;
                   height:100%;
               }
           }
           h4{
               width: 300px;
               margin: 80px auto;
               
           }
       }
   }
   
   
}








/*****************************************网站底部*******************************/

#footer{
    margin-top:30px;
    width:100%;
    height:255px;
    background:#000000;
    .foot_wrap{
        width: 980px;
        height:255px;
        margin:0 auto;
        .say{
            width:675px;
            height:115px;
            float:left;
            .p1{
                font:400 18px/80px '微软雅黑';
                color:#FFF;
            }
            .p2{
                font:400 16px/50px '微软雅黑';
                color:#FFF;
                text-align:right;
            }
        }
        .foot-logo{
            width:220px;
            height:200px;
            float:left;
        }
        p.infor{
            float:left;
            width:980px;
            height:30px;
            border-bottom:1px solid #666;
            margin-top:30px;
            font:400 12px/22px '微软雅黑';
//          text-align:center;
            color:#666;
            a{
                color:#666;
            }
        }
        p.link{
            float:left;
            font:400 12px/22px '微软雅黑'; 
            color:#666;
        }
    }
}



/***
 * 网站底部end
 */

